<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8">
<title>layui</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" th:href="@{/alllayui/layui/css/layui.css}"
	media="all">
<!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<body>
	<div class="layui-form searchTable">
		<div class="layui-form-item">
			<div class="layui-form-item">
				<div class="layui-inline">
					<label class="layui-form-label">开始时间：</label>
					<div class="layui-input-inline">
						<input type="text" name="startDate" id="startDate"
							placeholder="请选择开始时间" class="layui-input datePicker">
					</div>

					<label class="layui-form-label">结束时间：</label>
					<div class="layui-input-inline">
						<input type="text" id="FCheckDate" name="FCheckDate"
							placeholder="请选择结束时间" class="layui-input datePicker">
					</div>

					<!-- <label class="layui-form-label">销售人员：</label>
			<div class="layui-input-inline">
				<input type="text" name="documentNumber" autocomplete="off"
					class="layui-input">
			</div> -->
					<label class="layui-form-label"><button id="searchBtn"
					class="layui-btn" data-type="reload">搜索</button></label>

				</div>

			</div>
		</div>



		<div class="layui-form-item">
			<!-- <label class="layui-form-label">未创建采购入库单</label>
						<div class="layui-input-inline">
							<input type="checkbox" checked="" name="close" lay-skin="switch"
								lay-text="ON|OFF" />
								
						</div> -->

					<label class="layui-form-label">出库单单号：</label>
					<div class="layui-input-inline">
						<input type="text" name="FBillNo" id="FBillNo" autocomplete="off"
							class="layui-input">
					</div>



			<label class="layui-form-label">出库单状态：</label>
			<div class="layui-input-inline">
				<select id="status" name="status" lay-verify="required" lay-search="">
							<option value="">全部</option>
							<option value="CREATED">在库</option>
							<option value="COMPLETED">已出库</option>
							<option value="PARTIAL_COMPLETED">部分出库</option>
							<option value="CANCELED">取消</option>
						</select>
			</div>

			

			
		</div>
	</div>


	<table class="layui-hide" id="Resources" lay-filter="Resources"></table>

	



	<script type="text/javascript">
		var btnCls = [ 'layui-btn-warm', 'layui-btn-danger',
				'layui-btn-disabled', 'layui-btn-normal' ];
		function dict(rowD, str) {
			var ret = "";
			var btnIndex = 0;
			if (str == "type") {
				if (rowD.type == 0) {
					btnIndex = 0;
					ret = "启用";
				}
				if (rowD.type == 1) {
					btnIndex = 1;
					ret = "禁用";
				}
			}

			var btn = "<a class=\"layui-btn layui-btn-xs layui-btn-radius "+ btnCls[btnIndex]+ "\">"
					+ ret + "</a>";
			return btn;
		}
	</script>
	<script th:src="@{/alllayui/layui/layui.js}" charset="utf-8"></script>
	<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->

	<script>
		layui
				.use(
						[ 'jquery', 'table', 'form', 'laydate' ],
						function() {
							var table = layui.table;
							var laydate = layui.laydate;
							var queryWhere = {};
							var searchData = [];
							//常规用法
							laydate.render({
								elem : '#startDate'
							});

							laydate.render({
								elem : '#endDate'
							});

							//初始赋值
							//开始日期
							var start = laydate
									.render({
										elem : '#startDate',
										max : 0,//最大值为当前日期
										trigger : 'click',
										value : getRecentDay(0),//默认值30天前
										done : function(value, date) {
											if (value
													&& (value > $("#FCheckDate")
															.val())) {
												/*开始时间大于结束时间时，清空结束时间*/
												$("#FCheckDate").val("");
											}

											end.config.min = {
												year : date.year,
												month : date.month - 1,
												date : date.date,
											};
										}
									});
							//结束日期
							var end = laydate.render({
								elem : '#FCheckDate',
								max : 0,//最大值为当前日期
								trigger : 'click',
								value : getRecentDay(0),//默认值昨天
								done : function(value, date) {
									start.config.max = {
										year : date.year,
										month : date.month - 1,
										date : date.date,

									}
								}
							});

							/**获取近N天*/
							function getRecentDay(day) {
								var today = new Date();
								var targetday_milliseconds = today.getTime()
										+ 1000 * 60 * 60 * 24 * day;
								today.setTime(targetday_milliseconds);
								var tYear = today.getFullYear();
								var tMonth = today.getMonth();
								var tDate = today.getDate();
								tMonth = doHandleMonth(tMonth + 1);
								tDate = doHandleMonth(tDate);
								return tYear + "-" + tMonth + "-" + tDate;
							}
							function doHandleMonth(month) {
								var m = month;
								if (month.toString().length == 1) {
									m = "0" + month;
								}
								return m;
							}

							var form = layui.form;
							var tableIns = table
									.render({
										elem : '#Resources',
										url : '/sales/outboundDocumentsSearch',
										cellMinWidth : 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
										,
										method : 'post',
										where : queryWhere,
										toolbar : '#toolbarDemo' //开启头部工具栏，并为其绑定左侧模板
										,
										defaultToolbar : [ 'filter', 'exports',
												'print', { //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
													title : '提示',
													layEvent : 'LAYTABLE_TIPS',
													icon : 'layui-icon-tips'
												} ],
										title : 'Resources',
										cols : [ [
											  {field: 'creationTime', title:'记录创建时间',  align:'center' ,width:"10%"}
								              ,{field: 'documentNo', title:'单据表头编号',  align:'center', width:"10%" }
								              ,{field: 'documentType', title:'单据类型',  align:'center' , width:"10%"}
								              ,{field: 'documentTypeDesc', title:'单据类型描述',  align:'center', width:"10%" }
								               
								         
								              ,{field: 'batchNumber', title:'批次号',  align:'center' , width:"10%"}
								              ,{field: 'quantity', title:'已出库数量',  align:'center' , width:"10%"}
								              ,{field: 'entryNumber', title:'单据行项目编号',  align:'center', width:"10%" }
								              ,{field: 'materialNumber', title:'物料号',  align:'center'}
								              ,{field: 'materialDesc', title:'物料描述',  align:'center' }
								              
										] ],
										page : false,
										request : {
											pageName : 'currentPageNum' //页码的参数名称，默认：page
											,
											limitName : 'pageSize' //每页数据量的参数名，默认：limit
										},
										parseData : function(res) { //res 即为原始返回的数据
											console.log('res :',res);
											searchData = res.recordList;
											return {
												"code" : 0, //解析接口状态
												"msg" : "", //解析提示文本
												"count" : res.totalRecords, //解析数据长度
												"data" : res.recordList
											//解析数据列表
											};
										},
										done : function() {
											$("[data-field='finterID']").css(
													'display', 'none');
										}

									});

							//同时绑定多个
							lay('.datePicker').each(function() {
								laydate.render({
									elem : this,
									trigger : 'click',
									type : 'datetime'
								});
							});
							
						

							var $ = layui.$, active = {
								reload : function() {
									console.log('queryWhere = ========');
									var startDate = $("#startDate").val();
									var FBillNo = $("#FBillNo").val();
									var FCheckDate = $("#FCheckDate").val();
									var FName = $("#status").val();

									if(!startDate){
					                	 layer.msg('开始时间不能为空！', { icon: 7, time: 2000, shade: [0.6, '#000', true] });
					                	 return;
					                 }
									if(!FCheckDate){
					                	 layer.msg('结束时间不能为空！', { icon: 7, time: 2000, shade: [0.6, '#000', true] });
					                	 return;
					                 }
									//if((FBillNo!="") && (FBillNo.length>0)){
									queryWhere.FBillNo = FBillNo;
									//}
									//if((startDate!="") && (startDate.length>0)){
									queryWhere.FDate = startDate;
									//}
									//if((FCheckDate!="") && (FCheckDate.length>0)){
									queryWhere.FCheckDate = FCheckDate;
									//}
									//if((FName!="") && (FName.length>0)){
									queryWhere.FName = FName;
									//}
									//if((FTaxNum!="") && (FTaxNum.length>0)){
	
									//}
									console.log('queryWhere2 = ', queryWhere);
									//alert(queryWhere);
									//执行重载
									tableIns.reload({
										page : {
											curr : 1
										//重新从第 1 页开始
										},
										method : 'POST',
										where : queryWhere,
										done : function(res, curr, count) {
											console.log('res2 :', queryWhere);
											//this.where= {};
										}
									}, 'data');
								}
							};

							$('.searchTable .layui-btn').on(
									'click',
									function() {
										var type = $(this).data('type');
										active[type] ? active[type].call(this)
												: '';
									});

							//头工具栏事件
							table.on('toolbar(Resources)', function(obj) {
								var checkStatus = table
										.checkStatus(obj.config.id);
								switch (obj.event) {
								//自定义头工具栏右侧图标 - 提示
								case 'add':
									//iframe层-父子操作
								{
									/* var addIndex = layer.open({
									     type: 2,
									     area: ['700px', '450px'],
									     fixed: false, //不固定
									     maxmin: true,
									     content: '/resources/add'
									 });
									 layer.full(addIndex); */
									 console.log("data:",queryWhere);
									if (searchData.length == 0) {
										//layer.alert('暂无数据需要导入！');
										layer.msg('暂无数据创建试剂出库单！', {
											icon : 7,
											time : 3000,
											shade : [ 0.6, '#000', true ]
										});
										break;
									}
									layer.confirm('确定要创建试剂出库单吗？', function(
											index) {
										//console.log("obj:", index);
										var loading = layer.load(0, {
					                           shade: false
					                       });
										$.ajax({
											type : 'POST',
											url : '/sales/createDocuments',
											contentType : "application/json;charset=UTF-8",
											data : JSON.stringify(queryWhere),
											success : function(data) {
												layer.close(loading);
												//console.log('data:', data);
												/* if (data && data.code ) {
													layer.msg('创建成功！', {
														icon : 1,
														time : 2000,
														shade : [ 0.6, '#000',
																true ]
													});
												} */
												
												var errs=data.errs;
			                           			if(errs&&errs.length>0){
			                           				var htm="<table style='min-height: 25px; line-height: 25px; text-align: center; border-color:#151515; border-collapse: collapse;' border='1'><tr><td width='100px'>出库单号</td><td width='80px'>状态码</td><td width='450px'>描述</td></tr>";
			                               			for(var i=0;i<errs.length;i++){
			                               				htm +="<tr><td>"+errs[i].fname+"</td>";
			                               				htm +="<td>"+errs[i].fcode+"</td>";
			                               				htm +="<td>"+errs[i].desc+"</td></tr>";
			                               			}
			                               			htm +="</table>";
			                               			console.log('htm = '+htm);
			                                       layer.open({
			                                    	   area: ['700px', '350px'],
			                                    	   fixed: false, //不固定
			                                           maxmin: true,
			                                    	   title: '创建试剂出库单结果：'
			                                    	   ,content: htm
			                                    	 }); 
			                           			}
											}
										});
										layer.close(index);
									});
								}
									break;
								case 'LAYTABLE_TIPS':
									//layer.alert('这是工具栏右侧自定义的一个图标按钮');
									break;
								}
								;
							});

							//监听行工具事件
							table.on('tool(Resources)', function(obj) {
								var data = obj.data;
								//console.log(obj)
								if (obj.event === 'del') {
									layer.confirm('真的删除行么', function(index) {
										$.post("/resources/delete", {
											"id" : data.id
										}, function(data) {
											if (data.message == 'SUCCESS') {
												obj.del();
											} else {
												layer.msg(data.message);
											}

										}, "json");
										layer.close(index);
									});
								} else if (obj.event === 'edit') {
									//iframe层-父子操作
									var updateIndex = layer.open({
										type : 2,
										area : [ '700px', '450px' ],
										fixed : false, //不固定
										maxmin : true,
										content : '/resources/update?id='
												+ data.id
									});
									layer.full(updateIndex);
								}
							});

						});
	</script>

</body>
</html>